<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<!--请您根据自己网站情况把key替换成您需要的key，在此只是做一个示例。例:http://api.mapabc.com/fmp/v1.0/js/fmp.js?key=yourkey-->
<script src="http://api.mapabc.com/fmp/v1.0/js/fmp.js?key=d1ea565d65e2c62189c68dc31b216eb337a443b187efc933f93946ad0d85188bdc2eea5511dba634" type="text/javascript"></script>
<script src="http://api.mapabc.com/api/v1.0/js/ajaxsis.js?key=d1ea565d65e2c62189c68dc31b216eb337a443b187efc933f93946ad0d85188bdc2eea5511dba634" type="text/javascript"></script>
<script type="text/javaScript" language="JavaScript" src="http://www.mapabc.com/html/js/ajax/prototype.js"></script>
<title>关键字查询</title>
<style type="text/css">
body{ font-size:12px; margin:0; padding:0;}
#mapObj {
height: 300px;
width: 500px;
}
.style2 {font-size: small; }
.style3 {font-size: small;color: #FF0000}
</style>
<script language="JavaScript">
<!--关键字查询代码开始
var point = null;
function searchByKeyword(){
	mapObj.removeAllOverlays();//在每次执行新查询时，先删除已经查出的POI点
	//以下是从文本框中得到查询参数
	var citycode = document.form1.citycode.value;
	var keyword = document.form1.keyword.value
	var searchType = document.form1.searchType.value
	var number = document.form1.number.value
	var batch = document.form1.batch.value
	if(citycode == ""){
		alert("请填写城市区号，此处不能为空!");
		return false;
	}
	if(keyword == ""){
		alert("请填写查询关键子，此处不能为空!");
		return false;
	}

	var sis = new MSISSearch();//自定义sis变量调用查询方法
	var searchpointpara = new MSearchPointPara();//自定义searchpointpara变量调用设置参数方法
	//设置自定义函数名称，sis.setSISCallbackFunction(自定义函数名称)，此处自定义函数名称要与下面自定义函数名称一致
	sis.setSISCallbackFunction(keywordCallBack); 
	//开始把得到的参数传入set方法中
	searchpointpara.setCitycode(citycode);
	searchpointpara.setKeyword(keyword);
	searchpointpara.setSearchType(searchType);
	searchpointpara.setNumber(number);
	searchpointpara.setBatch(batch);
	sis.searchByKeyword(searchpointpara);
}

/**
 //data参数表示服务器端给客户端返回的JSON对象
 //通过循环JSON对象里的poilist将值遍历出来，在此JSON对象里的数组为poilist
 //如果想了解JSON对象请登陆http://org.json.com英文网站进行查询
**/
function keywordCallBack(data)
{
	//在html里加入表格
	var html = "<table width='100%' border='0'>";
	//判断返回值是否为空
	if (data.count != 0) {
		for (var i = 0; i < data.poilist.length; i++) {
			//用data.poilist[i].属性名称 得到值
			var pid = data.poilist[i].pguid;
			var data_citycode = data.poilist[i].citycode;
			var x = data.poilist[i].x;
			var y = data.poilist[i].y;
			var pointStyle = new MStyle();//调用MStyle设置TIP窗口样式
		    pointStyle.lineColor = 0xFFFFFF;//lineColor：线条颜色，RGB颜色格式
			pointStyle.lineSize = 2;//lineSize：线条的宽度。单位是像素
			pointStyle.fillColor = 0x4b8bd9;//fillColor：填充颜色，RGB颜色格式
			pointStyle.fillOpacity = 80;//fillOpacity：填充的不透明度
			pointStyle.labelColor = 0xFFFFFF;//labelColor：tips的label文字颜色，RGB颜色格式
			pointStyle.leading = 2;//leading：文字行距
		    var type = data.poilist[i].type;
		    if (type == "" || type == "undefined" || type == null) {
		    	type = "暂无";
		    }
		    var address = data.poilist[i].address;
		    if (address == "" || address == "undefined" || address == null) {
		    	address = "暂无";
		    }
		    var tel = data.poilist[i].tel;
		    if (tel == "" || tel == "undefined" || tel == null) {
		    	tel = "暂无";
		    }	    
		    var sContent = "<font color='#ffffff'><b>"+data.poilist[i].name+"</b></font><br>";
		    if (!type == "" && type != null) {
		   		sContent += "<font color='#ffffff'>类型:"+type+"</font><br/>";
		   	}
		   	if (!address == "" && address != null) {
				sContent += "<font color='#ffffff'>地址:"+address+"</font><br/>";
			}
			if (!tel == "" && tel != null) {
				sContent += "<font color='#ffffff'>电话:"+tel+"</font><br/>";
			}
			pointStyle.textContent = sContent;//textContent：tip窗口的文本内容
			point = new MPointOverlay(new MLatLng(y,x), i+1, pointStyle, i+1);//MPointOverlay：在地图上显示为一个有位置的点，有自己的样式和tip，能够接收事件。
			mapObj.addOverlay(point, true);	
			html += "<tr><td colspan='2' onclick=\"mapObj.setCenterByLatLng('"+data.poilist[i].y+"','"+data.poilist[i].x+"');mapObj.openTipById('"+(i+1)+"')\"><div align='left' class='style3'>"+(i+1)+"  "+data.poilist[i].name+"</div></td></tr><tr><td><div align='right' class='style2'>类型：</div></td><td class='style2'>"+type+"</td></tr><tr><td><div align='right' class='style2'>地址：</div></td><td class='style2'>"+address+"</td></tr><tr><td><div align='right' class='style2'>电话：</div></td><td class='style2'>"+tel+"</td></tr>";
		}
	} else {
		alert("对不起！此城市没有您要查找的关键字");
	}
	html += "</table>";
	$('result').innerHTML= html;
}
//关键字查询代码结束-->
</script>
</head>
<body>
<form name="form1" method="post" action="">
  <table width="310" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#f8f8f8" style="border:1px solid #e1e1e1; margin-top:20px;" >
    <tr>
      <td width="310" height="239" valign="top">
	  <table width="100%" border="0">
        <tr>
          <td height="50" colspan="2"><div align="center"><strong> 关键字查询</strong></div></td>
        </tr>
        <tr>
          <td width="42%"><div align="right">城市代码：</div></td>
          <td width="58%"><select name="citycode" id="citycode">
            <option value="010" selected="selected">北京市</option>
            <option value="021">上海市</option>
            <option value="022">天津市</option>
            <option value="023">重庆市</option>
          </select></td>
        </tr>
        <tr>
          <td><div align="right">关键字：</div></td>
          <td><input name="keyword" type="text" id="keyword" value="中国银行" /></td>
        </tr>
        <tr>
          <td><div align="right">关键字类型：</div></td>
          <td><input name="searchType" type="text" id="searchType" value="银行" /></td>
        </tr>
        <tr>
          <td><div align="right">返回数据数量：</div></td>
          <td><input name="number" type="text" id="number" value="10" /></td>
        </tr>
        <tr>
          <td><div align="right">批量显示数量：</div></td>
          <td><input name="batch" type="text" id="batch" value="1" /></td>
        </tr>
        <tr>
          <td><div align="right"></div></td>
          <td><input type="button" name="Submit" value="提交"  onclick="searchByKeyword()" /></td>
        </tr>
      </table>
      </td>
    </tr>
  </table>
</form>
<table width="926" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="420" height="300">
	<div style="width:420px; height:300px; overflow-y:auto;">
		<div id="result_start_name"></div>
		<div id="result_end_name"></div>
		<div id="result"></div>
	</div>
	</td>
    <td width="500" valign="top"><div align="right" id="mapObj" class="view"></div>
</td>
  </tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
//////////flash引擎///////////////
var city_center_index="fjtekqrposNKGE,hrlphplnJOOE";
//创建地图对象
var mapOptions = new MMapOptions();
mapOptions.mapId = "fmptest";
mapOptions.zoomLevel = 10;
mapOptions.center = new MLatLng(city_center_index);
//创建地图对象
var mapObj = new MMap("mapObj", mapOptions);
function mapInited(event){
	mapObj.showNavigator(true);
}
mapObj.addEventListener(MMap.EVENT_MAP_INITIALIZED, mapInited);
//////////flash引擎 end////////////
</SCRIPT>
</body>
</html>





	